var url = window.location.href;
// 使用 split 方法分割字符串，并获取第二个元素（索引为1的元素）
const hashPart = url.split("#")[1];

// 获取具有指定 ID 的元素
const element1 = document.getElementById("content1");
const element2 = document.getElementById("content2");
const titleBar1 = document.getElementById("title_bar1");
const titleBar2 = document.getElementById("title_bar2");
if (hashPart == "content11") {
  // 使用 classList.add 方法添加 'hidden' 类
  element2.classList.add("hidden");
  element1.classList.remove("hidden");
  titleBar1.classList.add("active");
  titleBar2.classList.remove("active");
} else if (hashPart == "content22") {
  // 使用 classList.add 方法添加 'hidden' 类
  element1.classList.add("hidden");
  element2.classList.remove("hidden");
  titleBar2.classList.add("active");
  titleBar1.classList.remove("active");
}
let Content_image = document.getElementById("content_image");

for (var i = 1; i < 9; i++) {
  var lis = document.createElement("li");
  var img = document.createElement("img");
  img.src = `../image/img/1 (${i}).jpg`;
  lis.appendChild(img);
  Content_image.appendChild(lis);
}

function jumpToFn(item) {
  let isUrl;
  if (item == "login") {
    isUrl = "./login.html";
  } else if (item == "about") {
    isUrl = "./about.html";
  } else if (item == "register") {
    isUrl = "./register.html";
  } else if (item == "novel") {
    isUrl = "../electronicBook/index.html";
  } else if (item == "message") {
    isUrl = "./message.html";
  }
  window.location.href = isUrl;
}

document.addEventListener("DOMContentLoaded", function () {
  fetch("../page/article.html")
    .then((response) => response.text())
    .then((data) => {
      // 移除 source.html 中的 <html>, <head>, 和 <body> 标签
      const content = data.match(/<body>([\s\S]*?)<\/body>/)[1];
      document.getElementById("content-container").innerHTML = content;
    })
    .catch((error) => console.error("Error fetching the source HTML:", error));
});

var titlebarLinks = document.querySelectorAll(".titlebar .nav-link");
var contentBlocks = document.querySelectorAll(".content");
var titlebarListItems = document.querySelectorAll(".titlebar li");

titlebarLinks.forEach(function (link) {
  link.addEventListener("click", function (event) {
    event.preventDefault(); // 阻止默认的锚点跳转行为

    // 移除所有内容区域的 'hidden' 类
    contentBlocks.forEach(function (content) {
      content.classList.add("hidden");
    });

    // 移除所有列表项的 'active' 类
    titlebarListItems.forEach(function (item) {
      item.classList.remove("active");
    });

    // 获取点击的链接的 href 属性（不包含 #）
    var targetId = this.getAttribute("href").substring(1);

    // 显示对应的内容区域
    var targetContent = document.getElementById(targetId);
    if (targetContent) {
      targetContent.classList.remove("hidden");
    }

    // 给对应的列表项添加 'active' 类
    var parentListItem = this.parentElement;
    parentListItem.classList.add("active");
  });
});

// JavaScript代码
const form = document.querySelector(".MyMessage_div");
if (form === null) {
  console.error("表单元素未找到！请检查元素ID是否正确。");
}
form.addEventListener("submit", function (event) {
  event.preventDefault(); // 阻止表单提交

  const nameInput = document.getElementById("name-input");
  const messageInput = document.getElementById("message-input");
  const messageList = document.getElementById("message-list");

  const name = nameInput.value;
  const message = messageInput.value;

  if (name == "") {
    alert("请输入name!");
    return;
  } else if (message == "") {
    alert("请输入message!");
    return;
  }

  const listItem = document.createElement("li");
  listItem.innerHTML = `<strong>${name}</strong>: ${message}`;
  messageList.appendChild(listItem);

  nameInput.value = "";
  messageInput.value = "";
});
